<!DOCTYPE html>
<html lang="cn">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
  <title data-i18n="doc_title">邮箱激活系统</title>
  <link rel="stylesheet" href="/static/css/common.css">
  <link rel="icon" href="/static/favicon.ico">
  <script src="/static/js/jquery/1.8.1/jquery.min.js"></script>
  <script src="/static/js/jquery.i18n/1.0.4/jquery.i18n.js"></script>
  <script src="/static/js/jquery.i18n/1.0.4/jquery.i18n.messagestore.js"></script>
  <script src="/static/i18n/i18n.js"></script>
</head>

<body>
  <div class="container">
    <dl class="state tac">
      <dt><img alt="state_logo"></dt>
      <dd></dd>
    </dl>
    <ul class="device_list gray"></ul>
    <div class="caution">
      <div class="line"></div>
      <div class="tac"><span class="txt" data-i18n="caution">温馨提示</span></div>
      <p class="active_tips tips" data-i18n="[html]auth_to_mis_manage">已授权设备请登录到内网账号中心中的“手机邮箱”中进行管理
      </p>
      <div class="reject_tips">
        <p class="tips" data-i18n="[html]to_mis_change_pwd">如果该设备不是您的设备，您的密码可能已经泄漏，请登录到内网账号中心修改密码</p>
        <p class="tips" data-i18n="[html]reject_to_mis_manage">已拒绝设备请登录到内网账号中心中的“手机邮箱”中进行管理
        </p>
      </div>
      <div class="exceed_tips">
        <p class="tips" data-i18n="[html]devices_exceeds_the_limit">已经激活的设备数超出了10台的限制，请登录到内网账号中心，在“手机邮箱”中删除不再使用的设备
        </p>
      </div>
      <div class="more_tips">
        <div class="tips">
          <p class="current"></p>
        </div>
        <p class="more_sec_info tac" data-i18n="[html]more_sec_info">更多安全知识，请访问<a href="https://sec.xiaomi.com">小米安全中心</a></p>
      </div>
    </div>
  </div>
  <script>
  $(function() {
    $('.active_tips, .reject_tips, .exceed_tips, .more_tips, .device_list').hide();
    var deviceInfo = [{
      name: $.i18n('device_model'),
      value: '{{.DeviceType}}'
    }, {
      name: $.i18n('device_id'),
      value: '{{.DeviceId}}'
    }, {
      name: $.i18n('IMEI'),
      value: '{{.Imei}}'
    },{
      name: $.i18n('phone_number'),
      value: '{{.PhoneNumber}}'
    }];
    var secTips = [];
    var res = {
      STATE_ACTIVED: {
        title: $.i18n('device_actived'),
        img: '/static/imgs/actived.png',
      },
      STATE_REJECTED: {
        title: $.i18n('device_rejected'),
        img: '/static/imgs/refused.png'
      },
      STATE_EXCEED: {
        title: $.i18n('device_exceed'),
        img: '/static/imgs/refused.png'
      },
      STATE_NOTFOUND: {
        title: $.i18n('page_not_found'),
        img: '/static/imgs/refused.png'
      },
      STATE_INVALID: {
        title: $.i18n('link_invalid'),
        img: '/static/imgs/refused.png'
      }
    };
    var state = '{{.ActiveStatus}}';
    var data = res[state];
    $('.state img').attr({
      src: data.img
    });
    $('.state dd').text(data.title);
    var deviceListHtml = [];
    for (var i = 0; i < deviceInfo.length; i++) {
      var li = '<li>' + deviceInfo[i].name + ' : ' + deviceInfo[i].value + '</li>';
      deviceListHtml.push(li);
    }
    deviceListHtml = deviceListHtml.join('');
    $('.device_list').html(deviceListHtml);
    switch (state) {
      case 'STATE_ACTIVED':
        $('.active_tips,.device_list').show();
        break;
      case 'STATE_REJECTED':
        $('.reject_tips,.device_list').show();
        break;
      case 'STATE_EXCEED':
        $('.exceed_tips').show();
        break;
      case 'STATE_INVALID':
      case 'STATE_NOTFOUND':
        $('.more_tips').show();
        break;
    }
    var tipsIndex = 0,
      timeInterval = 2000;
    $('.tips .current').text(secTips[tipsIndex]);
    var nextTip = function() {
      if (tipsIndex == secTips.length - 1) {
        tipsIndex = 0;
      } else {
        tipsIndex++;
      }
      $('.tips .current').text(secTips[tipsIndex]);
    }
    var lastTip = function() {
      if (tipsIndex == 0) {
        tipsIndex = secTips.length - 1;
      } else {
        tipsIndex--;
      }
      $('.tips .current').text(secTips[tipsIndex]);
    }
    setInterval(nextTip, timeInterval);
    $('.pre').on('click', lastTip);
    $('.next').on('click', nextTip);
  })
  </script>
</body>

</html>